<div class="content">
	<h3>Your personal settings</h3>

	<div id="alertsBox"></div>

	<accordion close-others="true">

		<accordion-group is-open="isAccountFormOpen">
			<accordion-heading>
				<span class="page_title">Account</span>
				<i class="pull-right fa" ng-class="{'fa-chevron-down': isAccountFormOpen, 'fa-chevron-right': !isAccountFormOpen}"></i>
			</accordion-heading>
			Utilizzo account:
			<ul>
				<li style="height:2.5rem;display:inline-block;">
					Clienti:  <progressbar value="userModel.account_customers_count" max="userModel.account_customers_limit" type="danger" style="width: 12rem;float:right;"><span style="color:black; white-space:nowrap;">{{userModel.account_customers_count}} / {{userModel.account_customers_limit}}</span></progressbar>
				</li><br/>
				<li style="height:2.5rem;display:inline-block;">
					Progetti:  <progressbar value="userModel.account_projects_count" max="userModel.account_projects_limit" type="success" style="width: 12rem;float:right;"><span style="color:black; white-space:nowrap;">{{userModel.account_projects_count}} / {{userModel.account_projects_limit}}</span></progressbar>
				</li>
			</ul>

			<div class="input-group form_field first_field full_field form_button">
					<button class="btn btn-default standard_button" ng-click="resetUserInformation()">
						<i class="fa fa-angle-double-down"></i> Downgrade
					</button>
					<button class="btn btn-default standard_button" type="button" ng-click="saveUserInformation(userModel)">
						Upgrade <i class="fa fa-angle-double-up"></i>
					</button>
				</div>
		</accordion-group>
		<hr/>

		<accordion-group is-open="isUserFormOpen">
			<accordion-heading>
				<span class="page_title">Edit User information</span>
				<i class="pull-right fa" ng-class="{'fa-chevron-down': isUserFormOpen, 'fa-chevron-right': !isUserFormOpen}"></i>
			</accordion-heading>
			<form name="userForm" id="userForm">
				<div class="input-group form_field first_field">
					<span class="input-group-addon">First Name</span>
					<input type="text" name="user_first_name" id="user_first_name" class="form-control" ng-model="userModel.firstName" />
				</div>
				<div class="input-group form_field">
					<span class="input-group-addon">Last Name</span>
					<input type="text" name="user_last_name" id="user_last_name" class="form-control" ng-model="userModel.lastName" />
				</div>
				<div class="input-group form_field first_field full_field">
					<span class="input-group-addon">Street name</span>
					<input type="text" name="user_address" id="user_address" class="form-control" ng-model="userModel.address.street" />
				</div>
				<div class="input-group form_field first_field">
					<span class="input-group-addon">Zip Code</span>
					<input type="text" name="customer_zip_code" id="customer_zip_code" class="form-control" ng-model="userModel.address.zipCode" />
				</div>
				<div class="input-group form_field">
					<span class="input-group-addon">City</span>
					<input type="text" name="customer_city" id="customer_city" class="form-control" ng-model="userModel.address.city" />
				</div>
				<div class="input-group form_field first_field">
					<span class="input-group-addon">IBAN</span>
					<input type="text" name="user_iban" id="user_iban" class="form-control" ng-model="userModel.iban" />
				</div>
				<div class="input-group form_field">
					<span class="input-group-addon">VAT nr.</span>
					<input type="text" name="user_vat_number" id="user_vat_number" class="form-control" ng-model="userModel.vatNumber" />
				</div>
				<div class="input-group form_field first_field full_field form_button" style="float:right;">
					<button class="btn btn-default standard_button" type="button" ng-click="saveUserInformation(userModel)">
						Save <i class="fa fa-floppy-o"></i>
					</button>
					<button class="btn btn-default standard_button" ng-click="resetUserInformation()"><!-- ng-show="isInEditMode" -->
						Cancel <i class="fa fa-ban"></i>
					</button>
				</div>
			</form>
		</accordion-group>
		<hr />
		<accordion-group is-open="isSettingsFormOpen">
			<accordion-heading>
				<span class="page_title">Edit Invoice settings information</span>
				<i class="pull-right fa" ng-class="{'fa-chevron-down': isSettingsFormOpen, 'fa-chevron-right': !isSettingsFormOpen}"></i>
			</accordion-heading>
			<form name="settingsForm" id="settingsForm">
				<div class="input-group form_field first_field full_field">
					<label for="invoice_header" class="control-label">Invoice Header</label><br />
					<textarea name="invoice_header" id="invoice_header" ng-model="invoiceSettingsModel.invoiceHeader" ui-tinymce="tinymceOptions" class="form-control"></textarea>
				</div>
				<div class="input-group form_field first_field full_field">
					<label for="invoice_footer" class="control-label">Invoice Footer</label><br />
					<textarea name="invoice_footer" id="invoice_footer" ng-model="invoiceSettingsModel.invoiceFooter" ui-tinymce="tinymceOptions" class="form-control"></textarea>
				</div>

				<div class="input-group form_field first_field full_field">
					<label class="control-label">Add additional taxes to invoices</label>
					<div class="input-group form_field first_field full_field" ng-repeat="tax in invoiceSettingsModel.invoiceTaxes">
						<div class="input-group form_field first_field">
							<span class="input-group-addon">Name</span>
							<input type="text" name="invoice_tax_name[]" class="form-control" ng-model="tax.name" />
						</div>
						<div class="input-group form_field small_field">
							<input type="text" name="invoice_tax_value[]" class="form-control numeric_field" ng-model="tax.value" style="width:70%;" />
							<select class="form-control" name="invoice_tax_type" ng-model="tax.type" style="width:30%;display:inline-block;border-left: none;">
								<option value="percentage">%</option>
								<option value="currency">&euro;</option>
							</select>
						</div>
						<div class="form_field small_field">
							<button ng-show="$index == (invoiceSettingsModel.invoiceTaxes.length -1)" type="button" class="btn btn-default" title="Add a new item" ng-click="addNewInvoiceTax()">
								<span class="fa fa-plus"></span>
							</button>
							<button type="button" class="btn btn-default" title="Remove this item" ng-show="!($index == (invoiceSettingsModel.invoiceTaxes.length -1))" ng-click="removeInvoiceTax($index)">
								<span class="fa fa-minus"></span>
							</button>
						</div>
					</div>
				</div>


				<div class="input-group form_field first_field full_field form_button" style="float:right;">
					<button class="btn btn-default" type="button" ng-click="saveInvoiceSettings(invoiceSettingsModel)">
						Save <i class="fa fa-floppy-o"></i>
					</button>
					<button class="btn btn-default" ng-click="resetInvoiceSettings()"><!-- ng-show="isInEditMode" -->
						Cancel <i class="fa fa-ban"></i>
					</button>
				</div>
			</form>
		</accordion-group>
	</accordion>
</div>